<template>
    <mi-select-tree v-model="value_c" :options="options" @change="change" />
</template>

<script setup lang="ts">

import {simpleGet} from "@/utils/request";
import {computed, onBeforeMount, ref} from "vue";

const props = withDefaults(defineProps<{
    modelValue?: number|number[],
    first?:string,
    multiple?: boolean
}>(),{
    first:'empty',
    multiple: false
})
const emits = defineEmits(['update:modelValue', 'change'])
const options = ref<any[]>([])

const value_c = computed({
    get:(): any => {
        if (!['all','top'].includes(props.first) && props.modelValue == 0){
            return undefined
        }else{
            return props.modelValue
        }
    },
    set:(val:number) => {
        emits("update:modelValue", val)
    }
})


const change = (val: number) => {
    emits("change", val)
}

onBeforeMount(() => {
    simpleGet('/index.site/articleCates').then((res:any) => {
        options.value = res.options
        if (props.first == 'all'){
            options.value.unshift({id:0, level:0, title:'全部'})
        }else if (props.first == 'top'){
            options.value.unshift({id:0, level:0, title:'顶级'})
        }
    })
})

</script>

<style scoped>

</style>
